<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%  
response.setHeader("Access-Control-Allow-Origin", "*");  
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <title>名医大全·数据工厂</title>
	<link href="${pageContext.request.contextPath }/img/webLogoIcon.png" rel="shortcut icon">
    <link href="${pageContext.request.contextPath }/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/font-awesome.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/animate.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/style.css" rel="stylesheet">
    <!-- FooTable -->
    <link href="${pageContext.request.contextPath }/css/footable.core.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/css/mypage.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/xqcss/xq.css" rel="stylesheet">
    <style>
		.select2_demo_1{
			float: left;
			width: 120px;
			display: inline;
			margin-left: 10px;
		}
		.form-control{
			display: inline;
		}
		
		.col-sm-3{
			float:right;
			width: 560px;
		}
		.input-group{
			float:right;
			width: 240px;
			margin-left: 5px;
		}
	   td{
	        vertical-align:middle;
	    }
	    .source{
	    	display:inline-block;
	        cursor: pointer;
		   	margin-bottom: 10px;
		    padding: 5px 5px;
		    border: 1px solid #ccc;
		    border-radius: 4px;
		    margin-right: 20px;
   		}
   		.sourceAct{
   			border-color:#f8ac59;
   			color:#f8ac59;
   		}
   		.webAct{
   			border-color:#f8ac59 !important;
   			color:#f8ac59;
   		}
   		.web{
	    	display:inline-block;
	        cursor: pointer;
		   	margin-bottom: 10px;
		    padding: 5px 5px;
		    border: 1px solid #ccc;
		    border-radius: 4px;
		    margin-right: 20px;
   		}
   		.search-result p{
   			font-size:14px;
   		}
	</style>
</head>
<body>
    <div id="wrapper">
        <nav class="navbar-default navbar-static-side" role="navigation">
            <%request.setAttribute("LEFT", "doctor");%>
            <%@include file="../components/left.jsp"%>
        </nav>
        <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom m-b-20">
		<jsp:include page="../components/head.jsp" flush="true" />
        </div>
        <div class="row wrapper border-bottom white-bg page-heading">
				<div class="col-lg-9">
					<h2>名医大全</h2>
					<ol class="breadcrumb">
						<li class="nav-main1"><a
							href="${pageContext.request.contextPath}/admin/tosystem_overview">主页</a>
						</li>
						<li class="nav-main2"><a
							href="${pageContext.request.contextPath}/doctor/doctor-page">名医大全</a>
						</li>
						<li class="active"><span id="doctorName"></span></li>
					</ol>
				</div>
			</div>
        <div class="content-item">
			<div class="content-item1">
				<div class="content-item1-top">
					<dl class="content-item1-dl1">
						<dt>
							<img id="img" src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2146034403,1504718527&fm=26&gp=0.jpg" onerror=src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2146034403,1504718527&fm=26&gp=0.jpg">
						</dt>
					</dl>

					<dl class="content-item1-dl2">
						<dt>
							<b style="width: 680px;height: 40px;display: block;">
								<span id="name" style="float: left;color: #333;font-size: 20px;line-height: 40px;"></span>
							</b>
							<p
								style="width: 680px;height: 25px;display: block;overflow: hidden;color: #2196f3;line-height: 25px;font-size: 14px;">
								<a id="hospital" href="" target="_blank" style="color: #2196f3;"></a>
							</p>
							<p
								style="width: 1080px;height: 40px;display: block;overflow: hidden;color: #576474;font-size: 14px;line-height: 40px;">
								<span id="department"
									style="color: #999;font-size: 14px;line-height: 40px;"></span>
							</p>
							<p
								style="width: 680px;height: 40px;display: block;overflow: hidden;color: #576474;font-size: 14px;line-height: 40px;">
								<span
									style="color: #999;font-size: 14px;line-height: 40px;">电话：</span><span class="phone_number"></span>
							</p>
						</dt>
						<dd style="width: 680px;height: auto;margin-top: 10px;">
							<p
								style="width: 680px;height: 40px;display: block;overflow: hidden;color: #576474;font-size: 14px;line-height: 40px;">
								<span
									style="color: #999;font-size: 14px;line-height: 40px;">擅长：</span><span id="adept"></span>
							</p>
							<p
								style="width: 680px;height: 50px;display: block;overflow: hidden;color: #576474;font-size: 14px;line-height: 25px;">
								<span
									style="color: #999;font-size: 14px;line-height: 25px;">简介：</span><span class="content"></span>
							</p>
						</dd>
					</dl>
				</div>
			</div>

			<div class="col-lg-6" style="margin: 0 auto;width: 100%;float: none;">
				<div class="tabs-container">
					<ul class="nav nav-tabs">
						<li class="active"><a data-toggle="tab" href="#tab-1">详细介绍</a></li>
						<li class=""><a data-toggle="tab" href="#tab-2">医生回答</a></li>
					</ul>
					<div class="tab-content">
						<div id="tab-1" class="tab-pane active">
							<div class="panel-body">
							   <div style="width: 820px;
							   height: auto;
							   overflow: hidden;
							   margin: 20px 0 0 29px;">
								<table class="table">
									<tbody>
									<tr>
										<td>行政职务：</td>
										<td><a id="administrative_function" style="cursor:text;">不详</a></td>
										<td>居住地：</td>
										<td class="address">不详</td>
									</tr>
									<tr>
										<td>学位：</td>
										<td id="degree">不详</td>
										<td>工作地址：</td>
										<td id="location">不详</td>
									</tr>
									</tbody>
								</table>
							</div> 

								<div style="width: 818px;height: auto;margin: 20px 0 0 30px;overflow: hidden;padding-bottom: 15px;">
									<b style="width: 818px;height: 40px;display: block;font-size: 20px;line-height: 40px;">
										<i style="width: 12px;height: 12px;background: #76d4da;float: left;border-radius: 50%;margin: 15px 10px 0 0;"></i>出诊时间
									</b>
									<div style="width: 818px;height: 40px;margin-bottom: 5px;">
										<span class="span1"><i style="width: 12px;height: 12px;background: red;display: inline-block;border-radius: 50%;margin: 15px 10px 0 0;"></i>特需门诊</span>
										<span class="span1"><i style="width: 12px;height: 12px;background: yellow;display: inline-block;border-radius: 50%;margin: 15px 10px 0 0;"></i>专科门诊</span>
										<span class="span1"><i style="width: 12px;height: 12px;background: green;display: inline-block;border-radius: 50%;margin: 15px 10px 0 0;"></i>专家门诊</span>
										<span class="span1"><i style="width: 12px;height: 12px;background: blue;display: inline-block;border-radius: 50%;margin: 15px 10px 0 0;"></i>普通门诊</span>
									</div>
									<div style="width: 816px;height: auto;overflow: hidden;">
										<table class="table table-bordered">
											<thead>
											<tr>
												<th>时段</th>
												<th>周一</th>
												<th>周二</th>
												<th>周三</th>
												<th>周四</th>
												<th>周五</th>
												<th>周六</th>
												<th>周日</th>
											</tr>
											</thead>
											<tbody>
											<tr>
												<td>上午</td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											<tr>
												<td>下午</td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											<tr>
												<td>晚上</td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											</tbody>
										</table>
									</div>
								</div>
								<div
									style="width: 820px;height: auto;border-bottom: 1px #e7e7e7 dashed;padding-bottom: 15px;overflow: hidden;margin: 20px 0 0 29px;">
									<b
										style="width: 820px;height: 40px;display: block;color: #333;font-size: 18px;line-height: 40px;margin-bottom: 10px;">
										<i
											style="width: 10px;height: 10px;border-radius: 50%;background: #76d4da;float: left;margin: 15px 10px 0 0;display: inline-block;"></i>医生简介
									</b>
									<p
										style="width: 820px;height: auto;color: #576474;font-size: 14px;line-height: 28px;display: block;">
										<span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="content"></span>
									</p>
								</div>
								<div
									style="width: 820px;height: auto;border-bottom: 1px #e7e7e7 dashed;padding-bottom: 15px;overflow: hidden;margin: 20px 0 0 29px;">
									<b
										style="width: 820px;height: 40px;display: block;color: #333;font-size: 18px;line-height: 40px;margin-bottom: 10px;">
										<i
											style="width: 10px;height: 10px;border-radius: 50%;background: #76d4da;float: left;margin: 15px 10px 0 0;display: inline-block;"></i>所获荣誉
									</b>
									<p
										style="width: 820px;height: auto;color: #576474;font-size: 14px;line-height: 28px;display: block;">
										<span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span id="honor"></span>
									</p>
								</div>
								<div
									style="width: 820px;height: auto;border-bottom: 1px #e7e7e7 dashed;padding-bottom: 15px;overflow: hidden;margin: 20px 0 0 29px;">
									<b
										style="width: 820px;height: 40px;display: block;color: #333;font-size: 18px;line-height: 40px;margin-bottom: 10px;">
										<i
											style="width: 10px;height: 10px;border-radius: 50%;background: #76d4da;float: left;margin: 15px 10px 0 0;display: inline-block;"></i>论文发表
									</b>
									<p id="paper"
										style="width: 820px;height: auto;color: #576474;font-size: 14px;line-height: 28px;display: block;">
									</p>
								</div>
								<div
									style="border-bottom: none;width: 818px;height: auto;margin: 20px 0 0 30px;overflow: hidden;padding-bottom: 5px;">
									<b
										style="width: 818px;height: 40px;;display: block;;font-size: 20px;;line-height: 40px;">
										<i
											style="width: 12px;height: 12px;background: #76d4da;float: left;border-radius: 50%;margin: 15px 10px 0 0;"></i>联系方式
									</b>
									<ul class="ul1"
										style="width: 818px;height: auto;margin-top: 15px;overflow: hidden;">
										<li>
											<span style="background-position: 0 -392px;letter-spacing: 7px;">网&nbsp;
												址：</span>
											<a id="detailUrl" href="#" target="_blank" style="color: #2196f3;"></a>
										</li>
										<li>
											<span style="background-position: 0 -535px;letter-spacing: 7px;">电&nbsp;
												话：</span>
											<em class="phone_number"></em>
										</li>
										<li>
											<span style="background-position: 0 -440px;letter-spacing: 7px;">传&nbsp;
												真：</span>
											<em></em>
										</li>
										<li>
											<span style="    background-position: 0 -584px;">电子邮件：</span>
											<em id="email"></em>
										</li>
										<li>
											<span style="background-position: 0 -488px;letter-spacing: 7px;">邮&nbsp;
												编：</span>
											<em id="postcode"></em>
										</li>
										<li>
											<span style="background-position: 0 -631px;letter-spacing: 7px;">地&nbsp;
												址：</span>
											<em class="address"></em>
										</li>
									</ul>
								</div>
							</div>
						</div>

					</div>
				</div>
			</div>

		</div>
		<jsp:include page="../components/footer.jsp" flush="true" />
        </div>
        </div>
   	
    <!-- Mainly scripts -->
    <script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
    <script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>
    <!-- Custom and plugin javascript -->
    <script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
    <script src="${pageContext.request.contextPath }/js/pace.min.js"></script>
    <!-- FooTable -->
    <script src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>
    <!-- Page-Level Scripts -->
    <script>
    
        $(document).ready(function() {
            $('.footable').footable();
        });
        
        <% 
	        String article_public_id = (String)request.getParameter("article_public_id");
	    %>
	    var article_public_id = '<%=article_public_id%>'
        
        $(function(){
        	detail()
		});
        
		function detail(){
        	$.ajax({
        		url : "${pageContext.request.contextPath}/doctor/doctorDetail",
        		type : "post",
        		data:{
        			article_public_id: article_public_id
        		},
        		success : function(res1) {
        			let res = JSON.parse(res1).list[0];
        			document.getElementById("doctorName").innerHTML=res.name
        			document.getElementById("name").innerHTML=res.name
        			document.getElementById("department").innerHTML=res.department
    				let contentEls=document.getElementsByClassName("content")
					for (const contentEl of contentEls) {
						contentEl.innerHTML=res.content.trim()
					}
        			document.getElementById("img").src=res.profile
					document.getElementById("hospital").href=res.hospital_url
					document.getElementById("hospital").innerHTML=res.hospital
					let phoneEls=document.getElementsByClassName("phone_number")
					for (const phoneEl of phoneEls) {
						phoneEl.innerHTML=res.phone_number
					}
					document.getElementById("adept").innerHTML=res.adept
					let addressEls=document.getElementsByClassName("address")
					for (const addressEl of addressEls) {
						addressEl.innerHTML=res.province+"  "+res.city+"  "+res.area
					}
					document.getElementById("degree").innerHTML=res.degree
					document.getElementById("location").innerHTML=res.location
					document.getElementById("honor").innerHTML=res.honor
					document.getElementById("paper").innerHTML=res.paper
					document.getElementById("detailUrl").href=res.detailUrl
					document.getElementById("detailUrl").innerHTML=res.detailUrl
					document.getElementById("email").innerHTML=res.email
					document.getElementById("postcode").innerHTML=res.postcode
					document.getElementById("administrative_function").innerHTML=res.administrative_function
        		},
        		error: function(err) {
        			console.log(err)
        		}
        	});
        }
		
		//跑马灯方法 
// 		 function init(){
// 			    //获取标题
// 			    var title=document.title;
// 			    //分割字符串--->字符数组
// 			    var arr=title.split("");
// 			    //删除第一个元素并返回该元素
// 			    var e=arr.shift();
// 			    //把一个对象添加到数组末尾
// 			    arr.push(e);
// 			    //把数组转换成字符串
// 			    var marquee=arr.join("");
// 			    //返回给浏览器
// 			    document.title=marquee;
// 			    //定时一直执行
// 			    window.setTimeout("init()",1000);
// 			}
// 			window.onload=init;
    </script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
</body>
</html>
